<template>
  <ul class="address-item-list clear js-address-item-list">
    <li class="js-choose-address " @click="liclick(index)" v-for='(item,index) in addressdata' :key="index" :class='item.isDefault?"selected-address-item":""'>
      <div class="address-item">
        <div class="name-section">{{item.username}}</div>
        <div class="mobile-section">{{item.phone}}</div>
        <div class="detail-section">
         {{item.loc[0].name}}{{item.loc[1].name}}{{item.loc[2].name}}
          <br />{{item.address}}
        </div>
      </div>
      <div class="operation-section">
        <span class="update-btn js-edit-address">修改</span>
        <span class="delete-btn js-delete-address">删除</span>
      </div>
    </li>
    <li class="add-address-item js-add-address" @click="liclick(-1)">
      <p>使用新地址</p>
    </li>
  </ul>
</template>

<script>
export default {
    data() {
        return {
            num:1
        }
    },
    props:['isShow'],
    methods: {
        liclick(n){
            this.$emit('showms',n);
            this.num=n
        }
    },
     computed: {
        addressdata(){
             return this.$store.state.address;
        }
    },
};
</script>

<style>
</style>